<template>
  <div>
    <div class="row">
      <div class="col-xs-offset-2 col-xs-8">
        <div class="page-header"><h2>Router Basic - 01</h2></div>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-2 col-xs-offset-2">
        <div class="list-group">
          <router-link to="/About" class="list-group-item">ABOUT</router-link>
          <router-link to="/Home" class="list-group-item">HOME</router-link>
          <!--        <a href="#/About" class="list-group-item router-link-exact-active"></a>
                  <a href="#/Home" class="list-group-item">Home</a>-->
        </div>
      </div>
      <div class="col-xs-6">
        <div class="panel">
          <div class="panel-body">
            <keep-alive>
              <!--keep-alive只会保证router-view涉及的页面保持活着的状态-->
              <router-view/>
            </keep-alive>
            <!--          <div>-->
            <!--            <h2>about组件</h2>-->
            <!--            <p>接受外部数据：北梦</p><input type="text">-->
            <!--          </div>-->
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>

/*js 页面跳转*/
// window.location = 'b.html'
export default {
  name: 'App'
}
</script>

<style>

</style>
